<template>
  <div class="hello">
    <button @click="increase">增加</button>
    <button @click="decrease">减少</button>
  </div>
</template>

<script>
import { mapMutations,mapActions } from "vuex";
import { INCREAMENT, DECREAMENT } from "../store/mutation-types";
export default {
  data(){
    return {
    }
  },
  methods:{
    // ...mapMutations(['increament','decreament']),
    ...mapMutations([INCREAMEN,DECREAMENT]),
    ...mapActions(['myIncrease','myDecrease']),
    async increase(){
      // this.$store.commit('increament');
      this.$store.commit(INCREAMEN,1);
     const products = await this.myIncrease({
       id:123
     })
     console.log(products)
    },
    decrease(){
      // this.$store.commit('decreament')
      this.$store.commit(DECREAMENT,1)
      this.myDecrease()
    }
  }
}
</script>

<style scoped lang="less">
h3 {
  margin: 40px 0 0;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
</style>
